<template>
	<div>
		用户名 <input type="text" v-model="obj.username"> <br>
		密码 <input type="text" v-model="obj.password"> <br>
	</div>
</template>

<script setup>
import { reactive ,watch} from 'vue';

// 监听 reactive 任何属性的变化都可以监听到
let obj = reactive({ username: "", password: "" })

// 监听 obj 里边所有的属性. newVal 给的是obj的地址
// watch(obj,(newVal,old) => {
// 	console.log("新的",newVal);
// 	console.log("旧的",old);
// })

// 监听某个 属性,非响应式的数据
watch( () => { return obj.username } ,(newVal,old) => {
	console.log("新的",newVal);
	console.log("旧的",old);
})

// 监听某个 属性,非响应式的数据
// watch( [() => { return obj.username },() => { return obj.password }] ,(newVal,old) => {
// 	console.log("新的",newVal);
// 	console.log("旧的",old);
// })

watch( [() => obj.username,() => obj.password] ,(newVal,old) => {
	console.log("新的",newVal);
	console.log("旧的",old);
})


</script>

<style  scoped></style>